import { _decorator, Button, Label, Node, ScrollView, size, Sprite, UITransform } from 'cc';
import { ScrollList } from '../../../A-FRAME/component/scroll.list';
import { Ab_BasePopUp_bA } from '../../../A-FRAME/component/ui.pop-up';
import Ab_Config_bA from '../../manager/config.manager';
import Ab_GameDC_bA from '../../manager/data.game.center';
import Ab_GameAssets_bA from '../../manager/game.assets';
import type { Ab_Popup_bA } from '../page/popup';
const { ccclass, property } = _decorator;

@ccclass('Ab_Rank_bA')
export class Ab_Rank_bA extends Ab_BasePopUp_bA<typeof Ab_Popup_bA, null> {
	@property(ScrollView)
	private Ab_scroll_view_bA: ScrollView = null;
	@property(ScrollList)
	private Ab_scroll_list_bA: ScrollList = null;

	protected Ab_default_return_bA: null;

	protected Ab_initAfterOnLoad_bA(){
		this.Ab_renderLocalUI_bA();
		this.Ab_scroll_list_bA.onRenderItem(this.Ab_renderItem_bA.bind(this));
	}

	protected Ab__click_event__bA: { [name: string]: (this: Ab_Rank_bA, button: Button) => void; } = {
		close(btn){
			btn.interactable = false;
			Ab_BasePopUp_bA.Ab_jelly_leave_bA(this.node).then(()=>{
				this.Ab_close_bA(null);
				btn.interactable = true;
			});
		}
	}

	public Ab_onShow_bA(){
		this.Ab_scroll_list_bA.setDataList(Ab_GameDC_bA.Ab_RankList_bA, 'place');
		this.Ab_scroll_view_bA.scrollToTop(0.05);

		Ab_BasePopUp_bA.Ab_jelly_enter_bA(this.node);
	}

	private Ab_renderLocalUI_bA(){
		(<const>[
			['rank', 32],
			['nickname', 29],
			['round', 30],
			['free', 31]
		]).forEach(([name, idx])=>this.node.getChildByName('head-'+name).getComponent(Label).string = Ab_GameAssets_bA.Ab_getLangText_bA(idx));

		this.node.getChildByName('lbl-refresh').getComponent(Label).string = Ab_GameAssets_bA.Ab_getLangText_bA(28, '00:00');

		let ui_title = this.node.getChildByName('title-rank').getComponent(UITransform)
		let title_size = size();
		title_size.width = this.node.getChildByName('background-time').getComponent(UITransform).width;
		title_size.height = ui_title.height;

		let sframe = Ab_GameAssets_bA.Ab_getLangTexture_bA(3);

		let scale = Math.min(title_size.width/sframe.originalSize.width, title_size.height/sframe.originalSize.height);

		ui_title.getComponent(Sprite).spriteFrame = sframe;

		ui_title.setContentSize(
			sframe.originalSize.width*scale,
			sframe.originalSize.height*scale
		);
	}

	private Ab_renderItem_bA(item: Node, data: typeof Ab_GameDC_bA.Ab_RankList_bA[number], node_cache: Map<Node, _RankNodeCache_>){
		let cache = node_cache.get(item);
		if(!cache){
			cache = this.Ab_createNodeCache_bA(item);
			node_cache.set(item, cache);
		}

		[cache.icon_rank1, cache.icon_rank2, cache.icon_rank3, cache.lbl_rank.node].forEach(el=>el.active = false);

		if(data.place<=3) cache['icon_rank'+data.place].active = true;
		else{
			cache.lbl_rank.node.active = true;
			cache.lbl_rank.string = data.place.toString();
		}

		cache.lbl_name.string = data.nickname;
		cache.lbl_round.string = data.round.toString();
		cache.lbl_symbol.string = Ab_Config_bA.Ab_symbolString_bA(data.symbol);

		let odd = data.place%2==1;
		cache.node_light.active = odd;
		cache.node_dark.active = !odd;
	}

	private Ab_createNodeCache_bA(node: Node){
		const node_dark = node.getChildByName('bg-dark');
		const node_light = node.getChildByName('bg-light');
		const icon_rank1 = node.getChildByName('icon-rank1');
		const icon_rank2 = node.getChildByName('icon-rank2');
		const icon_rank3 = node.getChildByName('icon-rank3');
		const lbl_rank = node.getChildByName('lbl-rank').getComponent(Label);
		const lbl_name = node.getChildByName('lbl-nickname').getComponent(Label);
		const lbl_round = node.getChildByName('lbl-round').getComponent(Label);
		const lbl_symbol = node.getChildByName('lbl-free').getComponent(Label);
		return { node_dark, node_light, icon_rank1, icon_rank2, icon_rank3, lbl_rank, lbl_name, lbl_round, lbl_symbol };
	}
}

type _RankNodeCache_ = {
	node_dark: Node;
	node_light: Node;
	icon_rank1: Node;
	icon_rank2: Node;
	icon_rank3: Node;
	lbl_rank: Label;
	lbl_name: Label;
	lbl_round: Label;
	lbl_symbol: Label;
}

